import { Button, Table, notification } from 'antd'
import {
  CheckOutlined,
  CloseOutlined
} from '@ant-design/icons';
import axios from 'axios'
import React, { useEffect, useState } from 'react'

function Audit(props) {
  const { roleId, username, region } = JSON.parse(localStorage.getItem("token"))

  const [dataSource, setdataSource] = useState([])
  useEffect(() => {
    const roleObj = {
      "1": "superadmin",
      "2": "admin",
      "3": "editor"
    }
    axios.get(`/news?auditState=1&_expand=category`).then((res) => {
      const list = res.data;
      // console.log(roleId);
      setdataSource(roleObj[roleId] === "superadmin" ? list : [
        ...list.filter(item => item.author === username),
        ...list.filter(item => item.region === region && roleObj[item.roleId] === "editor")
      ])
    })
  }, [roleId, username, region])


  const columns = [
    {
      title: '新闻标题',
      dataIndex: 'title',
      render: (title, item) => {
        return <a href={`#/news-manage/preview/${item.id}`} > {title}</a >
      }
    },
    {
      title: '作者',
      dataIndex: 'author'
    },
    {
      title: '新闻分类',
      dataIndex: 'category',
      render: (category) => {
        return category.title
      }
    },
    {
      title: "操作",
      render: (item) => {
        return <div>
          <Button
            type='primary'
            shape='circle'
            style={{ margin: "0px 10px" }}
            icon={<CheckOutlined />}
            onClick={() => {
              handleAudit(item,2,1)
            }}
          ></Button>
          <Button
            danger
            shape='circle'
            style={{ margin: "0px 10px" }}
            icon={<CloseOutlined />}
            onClick={() => {
              handleAudit(item,3,0)
            }}
          ></Button>
        </div>
      }
    }
  ];

  const handleAudit = (item,auditState,publishState) => {
    setdataSource(dataSource.filter(data => data.id !== item.id));
    axios.patch(`/news/${item.id}`, {
      "auditState": auditState,
      "publishState": publishState,
    }).then((res)=>{
      notification.info({
        message:"通知",
        description:`您可以到【审核管理/审核列表】中查看新闻的状态`,
        placement:"bottomRight"
      })
    })
  }


  return (
    <div>
      <Table
        dataSource={dataSource}
        columns={columns}
        pagination={{
          pageSize: 5
        }}
        rowKey={item => item.id}
      />
    </div>
  )
}

export default Audit